<template>
	<view class="contract-edit">
		<cu-custom bgColor="bg-gradual-blue" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">编辑合同</block>
		</cu-custom>
		<form>
			
			<!-- ================== 合同信息 ==================  -->
			<view>
				<view class="cu-bar text-gray ">
					<view class="action">
						 合同信息
					</view>
				</view>
				
				<!-- <view class="cu-form-group">
					<view class="title">合同名称:</view>
					<input  name="input" v-model="contract.title" placeholder="请输入合同名称："></input>
				</view> -->
				<view class="cu-form-group">
					<view class="title">合同编号:</view>
					<input  name="input" v-model="contract.num" placeholder="请输入合同编号"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">交易金额(元):</view>
					<input placeholder="请输入交易金额,单位(元)" name="input" v-model="contract.money"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">移交日期</view>
					<picker mode="date" :value="contract.handoverDate"  @change="DateChange">
						<view class="picker">
							{{contract.handoverDate}}
						</view>
					</picker>
				</view>
			</view>
			
			<!-- ====================== 房屋信息 ========================  -->
			<view>
				<view class="cu-bar text-gray">
					<view class="action">房屋信息</view>
				</view>
				<view class="cu-form-group">
					<view class="title">房屋权利人</view>
					<input placeholder="" v-model="house.ApplicantName"></input>
				</view>	
				<view class="cu-form-group">
					<view class="title">权利人身份证号</view>
					<input placeholder="" v-model="house.CertificateNumber"></input>
				</view>	
				<view class="cu-form-group">
					<view class="title">产权号</view>
					<input placeholder="" v-model="house.CertificateNo"></input>
				</view>	
				<view class="cu-form-group">
					<view class="title">地址</view>
					<!-- <input placeholder="平方米" name="input" v-model="hous.buildArea"></input> -->
					<text class="text-sm" style="color: #555;">{{house.Address}}</text>
				</view>
				<view class="cu-form-group">
					<view class="title">建筑面积</view>
					<input placeholder="平方米" name="input" v-model="hous.ConstructionArea"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">室内建筑面积</view>
					<input placeholder="平方米" name="input" v-model="house.ComprisingArea"></input>
				</view>				
			</view>

			
			
			
			<!-- #ifndef H5 || APP-PLUS || MP-ALIPAY -->
			<!-- <view class="cu-form-group">
				<view class="title">房屋坐落市区</view>
				<picker mode="region" @change="RegionChange" :value="region">
					<view class="picker">
						{{region[0]}}，{{region[1]}}，{{region[2]}}
					</view>
				</picker>
			</view> -->
			<!-- #endif -->
			<!-- <view class="cu-form-group">
				<view class="title">房屋详细地址</view>
				<input placeholder="请填写具体地址,省市区不用填写" name="input" v-model="location"></input>
			</view>	
			
			<view class="cu-bar text-gray">
				<view class="action">
					所有权人
				</view>
			</view> -->
			
			<view>
				<view class="cu-form-group margin-top">
					<view class="title">权利人:</view>
					<input  name="input" v-model="contract.obligeeName" ></input>
				</view>
				
				<view class="cu-form-group">
					<view class="title">共有人:</view>
					<input  name="input" v-model="contract.commonProprietorName" ></input>
				</view>
				
				<view class="cu-form-group">
					<view class="title">买受人:</view>
					<!-- <input  name="input" v-model="contract.vendeeName" ></input> -->
					<view>{{contract.vendeeName}}</view>
					<view class="action">
						<text class="cuIcon-close text-red" v-if="contract.vendeeName" @click="vendeeDelete"  ></text>
						<text class="cuIcon-write text-cyan" @click="showModal" data-target="vendee"></text>
					</view>
				</view>
			</view>
			
			
		</form>
		
		
		<view class="padding">
			<button class="cu-btn block bg-blue margin-tb-sm lg disabled"  @click="contractGenerate">
				合同生成</button>
		</view>
		
		<!-- ================= 买受人 =================  -->
		<view class="cu-modal " :class="modalName=='vendee'?'show':''" v-if="modalName=='vendee'">
			<!-- Property 性质 1: 买受人 2: 出卖人 -->
			<People @hideModal="hideModal" :member="room.CS_RoomMember" :property="property"></People>
		</view>		
	</view>
</template>

<script>
	import { cardid } from "@/common/utils/validate.js"
	import { addSignRoomContract } from '@/common/api/zft.js'
	import People from './people'
	export default {
		components: { People }, 
		data() {
			let currentDate = this.getDate({
				format: true
			})
			return {
				loading: false,
				modalName: '',
				region: ['贵州省', '贵阳市', '南明区'],
				contract: {
					// title: '',
					num: '',
					money: '',
					handoverDate: currentDate, // 移交日期
					obligeeName: '', // 权利人
					commonProprietorName: '', // 共有人,
					vendeeName: '', // 买受人
				},
				location: '',
				house: {
					obligeeIdcard: '', // 权利人身份证号
					qzNum: '',
					location: '',
					buildArea: '',
					insideBuildArea: '',
				},
				room: '',
				vendeeIndex: 0,
				vendeeNature: ['权利人', '共有人'],
				vendeeNatureIndex: 0,
				property: 1, // <!-- Property 性质 1: 买受人 2: 出卖人 -->
			}
		},
		computed: {
			user() {
				return this.$store.state.user.userList[0]
			}
		},
		onLoad () {
			console.log(' this.user: ', this.user)
			console.log(this.$transmit.get())
			let s = this.$transmit.get()
			if (s.to === 'contractEdit') {
				this.house = s.house
				this.room = s.room
				console.log(' this.house: ', this.house)	
				console.log(' this.room: ', this.room)
			}
		},
		methods: {
			showModal(e) {
				this.modalName = e.currentTarget.dataset.target
			},
			hideModal(e) {
				this.modalName = null
			},
			DateChange(e) {
				this.contract.handoverDate = e.detail.value
			},
			pickerChange(e, key) {
				this[key] = parseInt(e.detail.value)
			},
			contractGenerate () {
				// console.log(this.contract)
				if (!this.verify()) return;
				uni.showModal({
					title: '温馨提示',
					content: '请确保合同信息正确',
					cancelText: '取消',
					confirmText: '确定',
					success: res => {
						// 接口，提交合同基本信息
						
						if (res.confirm) {
							uni.navigateTo({
								url: '/pages/contract-sign/contract-sign'
							})
						}
						
					}
				})
				
			},
			// 校验
			verify() {
				return true;
				console.log('this.house.obligeeIdcard', typeof this.house.obligeeIdcard)
				let res = cardid(this.house.obligeeIdcard)
				console.log('res', res)
			},
			getDate(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
			
				if (type === 'start') {
					year = year - 60;
				} else if (type === 'end') {
					year = year + 2;
				}
				month = month > 9 ? month : '0' + month;;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			},
			
			// 买受人确定
			vendeeConfirm () {
				
			},
			
			// 添加合同
			addSignRoomContract() {
				if (this.loading) return
				
				let json = {
					// RoomId:	RoomId
					RoomId:	this.room.ID,		
					// ContractCode	合同编号
					ContractCode: this.contract.num,
					// Amount	合同金额
					Amount: this.contract.money,
					// HandoverDate	交房日期,  DateTime
					HandoverDate: this.contract.handoverDate,
					// SignDate	网签日期
					SignDate: '',
					// AddUserid	添加人Userid
					AddUserid: this.user.Userid,
					/*------------------*/
					// People	合同当事人  []
						// Userid	Userid
						// Address	地址
						// Phone	电话
						// Remarks	备注
						// Role	角色
						// Property	性质
						// IsAgent	是否代理人
					/*------------------*/
					/*------------------ */
					// Appendices	合同附件（图片） []
						// Title	标题
						// Title: this.contract.title,
						// ImgCode	图片转Base64字符串
						// Url	URL
						// Group	分组 0：其它 9：合同word  1：签字页  2：合同信息页
						// Descript	说明
						// Remarks	备注	
					/*------------------ */				
				}
				
				
				this.loading = true
				/////////////////////////////
				return true;
				/////////////////////////////////////
				addSignRoomContract(JSON.stringify(json)).then((data) => {
					if(data.msgcode == 1000) {
						
					} else {
						this.showToast(data.msg)
					}
					this.loading = false
				}).catch(() => {
					this.loading = false
					this.showToast('生成合同失败，请稍后重试')
				})
			}
			
		}
	}
</script>

<style lang="scss" scoped>
	.cu-form-group .title {
		min-width: calc(4em + 15px);
		white-space: nowrap;
	}

</style>
